<template>
	<div>
		
		<div class="smp-search smp_panel">
			<div class="smp_panel_header">
				<div class="smp_panel_pre"></div>
				<div class="smp_panel_title">工单开发</div>
			</div>
			<div class="smp_panel_body">
		
		
		<processBase :row="row"></processBase>


		<div class="innerTabs">
			<el-tabs >
				<el-tab-pane label="工单信息">
					<processDetails :operate="true" ref="processDetails" :row="row"></processDetails>
			
					<div class="smp-result smp_panel_1">
						<div class="smp_panel_header">
							<div class="smp_panel_pre"></div>
							<div class="smp_panel_title">流程审批</div>
							<div class="smp-panel_option">
							</div>
						</div>
					<div class="smp_panel_body">
					<el-form :inline="false" label-width="85px" size="mini" ref="form" :model="form" :rules="rules">
						<el-row>
							<el-col :span="24">
								<el-col :span="24">
									<el-form-item label="处理意见:" prop="resultMessage" >
										<el-input v-model="form.resultMessage" type="textarea"></el-input>
									</el-form-item>
								</el-col>
				
								<el-col :span="24">
									<el-form-item style="text-align: center;">
										<el-button size="mini" type="primary" plain
											@click="onSubmit">
											<i class="el-icon-check"></i>
											确认</el-button>
											
											<el-button size="mini" 
												@click="onReject">
												<i class="el-icon-close"></i>
												拒绝</el-button>
												
												<el-button size="mini"
													@click="onTrans">
													<i class="el-icon-refresh"></i>
													转派</el-button>
										
									</el-form-item>
								</el-col>
							</el-col>
						</el-row>
					</el-form>
					</div>
				</div>
				
				
				</el-tab-pane>
				<el-tab-pane label="流程信息">
					<processView :row="row"></processView>
				</el-tab-pane>
			<!-- 	<el-tab-pane label="完成确认">
					<div class="smp-search">
						<el-form :inline="false" label-width="100px" size="mini" ref="form" :model="form" :rules="rules">

							<el-row>
								<el-col :span="24">
									<el-col :span="24">
										<el-form-item label="处理意见:" prop="resultMessage" >
											<el-input v-model="form.resultMessage" type="textarea"></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="24">
										<el-form-item style="text-align: center;">
											<el-button size="mini" type="success" style="width: 150px;"
												@click="onSubmit">开发完成</el-button>
											
										</el-form-item>
									</el-col>
								</el-col>
							</el-row>
						</el-form>
					</div>
				</el-tab-pane> -->
			</el-tabs>
		</div>
	
	</div>
	</div>
	
	
	</div>
</template>

<script>
	"use strict";
	import {
		developConfirm 
	} from '@/api/demand.js';
	import {
		examine
	} from '@/api/process.js';
	import processBase from '../processCommon/processBase.vue';
	import processView from '../processCommon/processView.vue'
	import processDetails from '../processCommon/processDetails.vue';
	export default {
		data() {
			return {
				row: {},
				form: {
					applyId:'',
					taskId:'',
					developmentUserId: "",
					status: "",
					resultCode: "",
					resultMessage: "同意",
				},
				rules: {
					resultMessage: [{
						required: true,
						message: "处理意见不能为空",
						trigger: ['blur', 'change']
					}]
				},
			};
		},
		created() {
		
			this.row = this.$route.query;
			this.form.taskId = this.row.taskId;
			this.form.applyId=this.row.sid
			//this.getNum();
		},
		components: {
			processBase,
			processView,
			processDetails
		},
		methods: {
			onSubmit() {
				/* alert(this.form.applyId); */
				this.$refs["form"].validate(valid => {
					if (valid) {
						developConfirm({"applyId":this.form.applyId,"resultMessage":this.form.resultMessage}).then(response => {
							if(response.data.code == "0000"){
								this.$message.success(response.data.message);
								this.$store.dispatch("updateTaskNum").then(()=>{
									let panel = {key:this.$route.path};
									 this.$store.dispatch('removePanel', panel).then(()=>{
										 this.$router.push({name:'mytask',query:{}})
									 })
								
								})
							}else{
								this.$message.error(response.data.message);
							}
							
						}).catch(error => {
							this.$message.error(error.message);
						});
					}
				});
				
				
			/* 	this.form.status="0";
				examine(this.form).then(response => {
						if(response.data.code == "0000"){
							this.$message.success(response.data.message);
						}else{
							this.$message.error(response.data.message);
						}
						
						this.$store.dispatch("updateTaskNum").then(()=>{
							this.$router.push({path:'/main/processManage/mytask',query:{}})
						})
						
					}).catch(error => {
						this.$message.error(error.message);
					}); */
			},
			
			onReject() {
				this.$refs["form"].validate(valid => {
					if (valid) {
				this.form.status="9";
				examine(this.form).then(response => {
						if(response.data.code == "0000"){
							this.$message.success(response.data.message);
							this.$store.dispatch("updateTaskNum").then(()=>{
								let panel = {key:this.$route.path};
								
								this.$store.dispatch('removePanel', panel).then(()=>{
								 this.$router.push({name:'mytask',query:{}})
								})
								
							})
						}else{
							this.$message.error(response.data.message);
						}
					}).catch(error => {
						this.$message.error(error.message);
					});
					}
					});
			},
			onTrans() {
				this.$refs["form"].validate(valid => {
					if (valid) {
				this.form.status="5";
				examine(this.form).then(response => {
						if(response.data.code == "0000"){
							this.$message.success(response.data.message);
							this.$store.dispatch("updateTaskNum").then(()=>{
								let panel = {key:this.$route.path};
								 this.$store.dispatch('removePanel', panel).then(()=>{
								  this.$router.push({name:'mytask',query:{}})
								 })
							})
						}else{
							this.$message.error(response.data.message);
						}
					}).catch(error => {
						this.$message.error(error.message);
					});
					}
					});
			}
			
		}
	};
</script>

<style scoped>
	.detailsTitle {
		color: black;
		font-size: 18px;
		text-align: left;
		margin-top: 10px;
		margin-left: 20px;
		margin-bottom: 10PX;
		border-left: 3px solid #090;
		line-height: 24px;
		padding-left: 10px;
		color: #57595d;
	}

	.serviceInfo1 {
		margin-left: 20px;
	}

	.serviceInfo {
		text-align: left;
		margin-left: 40px;
	}

	.serviceInfo span {
		line-height: 30px;
		text-align: left;
		color: #606266;
		font-size: 14px;
	}

	.el-divider--horizontal {
		margin: 12px 0;
		;
	}
	.smp-result{
		text-align: left;
		margin-left: 0px;
	}
</style>
